<!DOCTYPE html>
<html lang="en" xmlns:v-on="http://www.w3.org/1999/xhtml">
<head>
    <meta charset="UTF-8">
    <title>v-model</title>
    <script src="js/vuejs-2.5.16.js"></script>
</head>
<body>
                <div id="app">
                    <!--用户添加点击事件 可以数字+1  -1-->
                    <input type="button" value="+"  v-on:click="add">
                    <input type="button" value="-" v-on:click="minus">
                    <br>
                      简化版本  @  ==  v-on:<br>
                    <input type="button" value="++"  @click="add">
                    <input type="button" value="--"  @click="minus">
                    <br>

                    简化版本 2 <br>
                    <input type="button" value="+++"  @click="num++">
                    <input type="button" value="---"  @click="num--">
                    <br>

                    {{num}}

                </div>

                <script type="text/javascript">
                    var app = new Vue({
                        el:"#app",
                        data:{
                            num:0,  //  初始化数据模型
                            formdata1:{
                                heima:'world'
                            },
                            formdata2:{
                                heima:'hello'
                            }
                        },
                        // methods 区域 声明自定义函数
                        methods:{
                            add(){
                                console.info(this)
                               this.num++
                                this.formdata2.heima;
                                // this._data.num++
                            },
                            minus(){
                                this.num--
                            },
                            cc(){},
                        }

                    })
                </script>

</body>
</html>